<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: longhunpomie
  Date: 2022/11/7
  Time: 7:47
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <%
        String basePath = request.getScheme() + "://" +
                request.getServerName() +
                ":" + request.getServerPort() +
                request.getContextPath() + "/";
        pageContext.setAttribute("basePath", basePath);
    %>
    <meta charset="utf-8" />
    <title>编写博客</title>
    <link rel="shortcut icon" href="../../static/img/logo_chzu1.png" type="image/x-icon" />
    <link rel="stylesheet" href="../../static/lib/editor.md-master/examples/css/style.css" />
    <link rel="stylesheet" href="../../static/lib/editor.md-master/css/editormd.css" />
    <script type="text/javascript">
        function saveContent(){
            let content = $("#blogContent").val();//通过id获取<textarea>标签中编辑的内容
            let blogHead = $("#blogHead").val();
            var firstTag = $("#firstTag").val();
            var secondTag = $("#secondTag").val();
            var thirdTag = $("#thirdTag").val();
            if(firstTag == secondTag || secondTag == thirdTag || firstTag == thirdTag){
                alert("标签不可以相同！");
                return false;
            }
            $.ajax({
                type:"post",
                url:"${basePath}/blog/addBlog",//保存数据的接口
                dataType: "json",
                /*data:"content="+content+"&blogHead="+blogHead+"&name=${requestScope.name}",*/ //注入问题导致字符串截断
                data:{content:content, blogHead:blogHead, name:"${requestScope.user.name}", firstTag:firstTag, secondTag:secondTag, thirdTag:thirdTag},
                success:function(data){
                    if(data==1){
                        alert("保存成功");
                    }
                }
            });
        }
    </script>
</head>
<body>
<div id="layout">
    <header>
        <h1>
            <c:if test="${not empty requestScope.user.headImg}">
                <img src="${basePath}user/img?name=${requestScope.name}" style="width: 50px;height:50px;border-radius: 50%;" alt="">
            </c:if>
            <c:if test="${empty requestScope.user.headImg}">
                <img src="../../static/img/defaultHeadImg3.png" style="width: 50px;height:50px;border-radius: 50%;" alt="">
            </c:if>
            ${requestScope.user.name}编写我的博客</h1>
        <button id="save" class="" type="button" onclick="saveContent()" style="width: 100px;height: 50px;">保存</button>
        <input type="text" name="blogHead" id="blogHead" placeholder="请输入标题" style="height: 50px">
        <jsp:include page="../../pages/common/Tag.jsp"></jsp:include>
    </header>
    <div id="test-editormd">
                <textarea id="blogContent" style="display:none;">[TOC]

#### Disabled options

- TeX (Based on KaTeX);
- Emoji;
- Task lists;
- HTML tags decode;
- Flowchart and Sequence Diagram;

#### Editor.md directory

    editor.md/
            lib/
            css/
            scss/
            tests/
            fonts/
            images/
            plugins/
            examples/
            languages/
            editormd.js
            ...

```html
                    &lt;!-- English --&gt;
                    &lt;script src="../dist/js/languages/en.js"&gt;&lt;/script&gt;

                    &lt;!-- 繁體中文 --&gt;
                    &lt;script src="../dist/js/languages/zh-tw.js"&gt;&lt;/script&gt;
                    ```
</textarea>
    </div>
</div>
<script src="../../static/lib/editor.md-master/examples/js/jquery.min.js"></script>
<script src="../../static/lib/editor.md-master/editormd.js"></script>
<script type="text/javascript">
    var testEditor;

    $(function() {
        testEditor = editormd("test-editormd", {
            width   : "90%",
            height  : 640,
            syncScrolling : "single",
            saveHTMLToTextarea:true,//保存markdown中的内容开启
            path    : "../../static/lib/editor.md-master/lib/",
            imageUpload : true,
            imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
            imageUploadURL : "${basePath}/editor/upload",
            tocm : true, // Using [TOCM]
            emoji:true,
            tex : true, // 开启科学公式TeX语言支持，默认关闭
            flowChart : true, // 开启流程图支持，默认关闭
            imageUpload : true,
        });

        /*
        // or
        testEditor = editormd({
            id      : "test-editormd",
            width   : "90%",
            height  : 640,
            path    : "/static/lib/editor.md-master/lib/"
        });
        */
    });

</script>
<jsp:include page="../../pages/common/footer.jsp"></jsp:include>
</body>
</html>
